<template>
  <div class="box">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="基本信息" name="first">
        <el-form ref="form" label-width="80px">
          <el-row :gutter="20">

            <el-col :span="12">
              <el-form-item label="员工编号:">
                <el-input v-model="formData.account" disabled />
              </el-form-item>
              <el-form-item label="司机名称:">
                <el-input v-model="formData.name" disabled />
              </el-form-item>
              <el-form-item label="所属机构:">
                <el-input v-model="formData.agency.name" disabled />
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item label="手机号:">
                <el-input v-model="formData.mobile" disabled />
              </el-form-item>
              <el-form-item label="年龄:">
                <el-input v-model="formData.age" placeholder=" - -" />
              </el-form-item>

            </el-col>

          </el-row>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="驾驶证信息" name="second">驾驶证信息</el-tab-pane>
    </el-tabs>
    <el-button type="primary" @click="save">保存编辑</el-button>
    <el-button type="danger" @click="$router.push('/employee/driver')">返回</el-button>
  </div>
</template>

<script>
import { viewDriver, saveDriver } from '@/api/employee/driver'
export default {
  data() {
    return {
      activeName: 'second',
      formData: {
        age: '',
        avatar: '',
        mobile: '',
        name: '',
        //  account: '',
        userId: '',
        workNumber: '',
        workStatus: ''
      },
      newData: {}

    }
  },
  created() {
    // console.log(this.$route.params.id)
    console.log(this.$route.params.id)
    this.viewDriver()
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab)
      console.log(event)
    },
    async viewDriver() {
      const res = await viewDriver(this.$route.params.id)
      this.formData = res.data
      // this.formData.age = res.data.age
      // this.formData.avatar = res.data.picture
      // this.formData.mobile = res.data.mobile
      // this.formData.name = res.data.name
      // this.formData.userId = res.data.userId
      // this.formData.workNumber = res.data.workNumber
      // this.formData.workStatus = res.data.workStatus
      this.newData.age = this.formData.data.age
      this.newData.avatar = this.formData.data.picture
      this.newData.mobile = this.formData.data.mobile
      this.newData.name = this.formData.data.name
      this.newData.userId = this.formData.data.userId
      this.newData.workNumber = this.formData.data.workNumber
      this.newData.workStatus = this.formData.data.workStatus
      console.log(res)
    },
    async save() {
      const res = await saveDriver(this.newData, this.$route.params.id)
      this.$message.success('操作成功')
      console.log(res)
    }
  }
}
</script>
<style>
.box {
  margin: 0 30px;

}
</style>
